<template>
  <el-table v-loading="logTableLoading" :data="tableData" border style="width: 100%">
    <el-table-column align='center' prop="username" label="登入账号" />
    <el-table-column align='center' prop="lastLogin.ip" label="上次登入ip" />
    <el-table-column align='center' prop="lastLogin.loginTime" sortable label="上次登入时间" />
    <el-table-column align='center' prop="nowLogin.ip" label="本次登入ip" />
    <el-table-column align='center' prop="nowLogin.loginTime" sortable label="本次登入时间" />
  </el-table>
</template>
<script setup>




import { getLoginLogApi } from "@/api/users"

import { onMounted, ref } from "vue"



const tableData = ref([])



let logTableLoading = ref(false)



let getLoginLog = async () => {
  
  logTableLoading.value = true;
  try {
    
    let res = await getLoginLogApi()
    tableData.value = res.data.data
    console.log(res)
    
    logTableLoading.value = false;
  } catch (e) {
    console.log(e)
    logTableLoading.value = false
  }
}


onMounted(() => {
  getLoginLog()
})

</script>
<style scoped>
.demonstration {
  color: var(--el-text-color-secondary);
}

.el-carousel__item h3 {
  color: #475669;
  opacity: 0.75;
  line-height: 150px;
  margin: 0;
  text-align: center;
}

.el-carousel__item:nth-child(2n) {
  background-color: #99a9bf;
}

.el-carousel__item:nth-child(2n + 1) {
  background-color: #d3dce6;
}
</style>